<template>
    <MyHome></MyHome>
    <div v-if="channel.adminLogin === true" class="bigbox">
        <!-- 允许购票 -->
        <div>
            <span>允许购票:</span>
            <el-switch v-model="channel.value1"
            size="large"
    />
        </div>

         <!-- 允许退票 -->
         <div>
            <span>允许退票:</span>
            <el-switch v-model="channel.value2" 
            size="large"
            />
        </div>

         <!-- 允许改签 -->
         <div>
            <span>允许改签:</span>
            <el-switch v-model="channel.value3" 
            size="large"
            />
        </div>


    </div>
    <div v-if="channel.adminLogin === false" class="user">
        <img src="../../assets/管理员.png" alt="cw">
        <div class="wz1">
            您好，您的权限没有权限访问！
        </div>
    </div>
</template>

<script setup>
import MyHome from '../top/MyHome.vue';
import { useCounterStore } from '../../stores/counter'
const channel = useCounterStore()


</script>

<style scoped>
    .bigbox{
        width: 700px;
        height: 400px;
        margin: 30px auto;
        background-color:azure;
        border-radius: 10px;
        padding: 20px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    .bigbox>div{
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 50px;
        margin-top: 30px;
    }
    .bigbox>div>span{
        font-size: 30px;
        font-weight: 600;
        margin-right: 20px;
    }
    .user{
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 100px;
    }
    img{
        width: 100px;
        height: 100px;
    }
    .wz1{
        margin-left: 20px;
        font-size: 20px;
        font-weight: 600;
    }
</style>